<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org"
      xmlns:layout="http://www.ultraq.net.nz/web/thymeleaf/layout"
      layout:decorator="admin/public/layout">

<head>
    <title>邮箱配置</title>
</head>
<div  layout:fragment="content">
    <section class="content-header">
        <h1>邮箱配置</h1>
    </section>
    <section class="content">
        <div class="row">
            <div class="col-xs-12">
                <div class="callout callout-warning" th:if="${error}">
                    <h4>数据保存失败！</h4>
                    <ol>
                        <li  th:text="${error.message}"></li>
                    </ol>
                </div>
                <div class="box box-primary">
                    <form th:object="${settingEmail}" role="form" name="settingForm" method="POST" th:action="@{/admin/setting/email}">
                        <input type="hidden" name="id" th:value="${GlobalSetting.email.id}"/>
                        <div class="box-body">


                            <div class="form-group">
                                <label>开启邮件功能</label>
                                <span class="text-muted">(若关闭则不会有邮件通知)</span>
                                <div class="radio">
                                    <label><input type="radio" name="open" value="true" th:checked="${settingEmail.open}" /> 开启 </label>
                                    <label class="ml-20"><input type="radio" name="open" value="false" th:checked="!${settingEmail.open}" > 关闭 </label>
                                </div>
                            </div>

                            <div th:class="${#fields.hasErrors('fromAddress')}?'form-group has-error':'form-group '">
                                <label>邮件来源地址</label>
                                <span class="text-muted">(默认跟发送账号保持一致，例如:364337403@qq.com)</span>
                                <input type="text" name="fromAddress" class="form-control " placeholder="邮件来源地址" th:value="${settingEmail.fromAddress}">
                                <p class="help-block" th:if="${#fields.hasErrors('fromAddress')}" th:text="${#fields.errors('fromAddress')[0]}"></p>
                            </div>

                            <div th:class="${#fields.hasErrors('fromName')}?'form-group has-error':'form-group '">
                                <label>邮件来源名称</label>
                                <span class="text-muted">(显示邮件名称部分，例如:一起smart)</span>
                                <input type="text" name="fromName" class="form-control " placeholder="邮件来源名称" th:value="${settingEmail.fromName}">
                                <p class="help-block" th:if="${#fields.hasErrors('fromName')}" th:text="${#fields.errors('fromName')[0]}"></p>
                            </div>

                            <div class="form-group">
                                <label>邮件类型</label>
                                <span class="text-muted">(邮件发送方式)</span>
                                <select name="driver" id="mail_driver" class="form-control">
                                    <option value="smtp" th:selected="${settingEmail.driver == 'smtp'}">连接 SMTP 服务器发送</option>
                                    <option value="sendmail" th:selected="${settingEmail.driver == 'sendmail'}">通过sendmail方式进行发送</option>
                                </select>
                            </div>

                            <div th:class="${#fields.hasErrors('host')}?'form-group has-error':'form-group '">
                                <label>SMTP 服务器</label>
                                <span class="text-muted">(例如：smtp.exmail.qq.com)</span>
                                <input type="text" name="host" class="form-control " placeholder="邮件服务器地址" th:value="${settingEmail.host}">
                                <p class="help-block" th:if="${#fields.hasErrors('host')}" th:text="${#fields.errors('host')[0]}"></p>
                            </div>

                            <div th:class="${#fields.hasErrors('port')}?'form-group has-error':'form-group '">
                                <label>SMTP 端口</label>
                                <span class="text-muted">(设置 SMTP 服务器的端口，默认为 25)</span>
                                <input type="text" name="port" class="form-control " placeholder="SMTP 端口 默认25" th:value="${settingEmail.port}">
                                <p class="help-block" th:if="${#fields.hasErrors('port')}" th:text="${#fields.errors('port')[0]}"></p>
                            </div>

                            <div class="form-group smtp-item">
                                <label>邮件安全加密方式</label>
                                <span class="text-muted">(请根据邮件实际情况进行配置)</span>
                                <div class="radio">
                                    <label><input type="radio" name="encryption" value="" th:checked="${settingEmail.encryption == ''}" > 无 </label>&nbsp;&nbsp;
                                    <label><input type="radio" name="encryption" value="ssl" th:checked="${settingEmail.encryption == 'ssl'}" > SSL </label>&nbsp;&nbsp;
                                    <label><input type="radio" name="encryption" value="tls" th:checked="${settingEmail.encryption == 'tls'}" > TLS </label>
                                </div>
                            </div>

                            <div th:class="${#fields.hasErrors('username')}?'form-group has-error':'form-group '">
                                <label>邮箱地址</label>
                                <span class="text-muted">(例如tipask@qq.com)</span>
                                <input type="text" name="username" class="form-control " placeholder="邮件服务器地址" th:value="${settingEmail.username}">
                                <p class="help-block" th:if="${#fields.hasErrors('username')}" th:text="${#fields.errors('username')[0]}"></p>
                            </div>

                            <div th:class="${#fields.hasErrors('password')}?'form-group smtp-item has-error':'form-group smtp-item '">
                                <label>邮箱密码</label>
                                <span class="text-muted">(根据实际情况填写你邮箱的密码或第三方客户端授权码)</span>
                                <input type="password" name="password" class="form-control " placeholder="邮箱认证密码" th:value="${settingEmail.password}">
                                <p class="help-block" th:if="${#fields.hasErrors('password')}" th:text="${#fields.errors('password')[0]}"></p>
                            </div>


                            <div th:class="${#fields.hasErrors('sendMail')}?'form-group sendmail has-error':'form-group  sendmail'">
                                <label>SendMail命令配置</label>
                                <span class="text-muted">(设置SendMail命令配置)</span>
                                <input type="text" name="sendMail" class="form-control " placeholder="/usr/sbin/sendmail -bs"   th:value="${settingEmail.sendMail}">
                                <p class="help-block" th:if="${#fields.hasErrors('sendMail')}" th:text="${#fields.errors('sendMail')[0]}"></p>
                            </div>

                        </div>
                        <div class="box-footer">
                            <button type="submit"  class="btn btn-primary">保存</button>
                            <button type="button" class="btn btn-success" id="btn_test_email" >发送测试邮件</button>
                        </div>
                    </form>

                </div>
            </div>
        </div>
    </section>
    <div class="modal fade" id="test_email_model"  role="dialog">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                    <h4 class="modal-title" id="exampleModalLabel">发送测试邮件</h4>
                </div>
                <div class="modal-body">
                    <form name="messageForm" id="message_form">
                        <div class="form-group">
                            <label class="control-label">收件人邮箱：</label>
                            <input type="email" class="form-control" id="test_send_to" name="sendTo" value="" placeholder="收件人邮箱地址" />
                        </div>
                        <div class="form-group">
                            <label class="control-label">内容:</label>
                            <textarea class="form-control" id="test_email_content" name="content">你好，这是一封测试邮件。收到邮件后请不要回复！</textarea>
                        </div>
                    </form>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
                    <button type="button" class="btn btn-primary" id="submit_test_email">发送</button>
                </div>
            </div>
        </div>
    </div>
    <script type="text/javascript">
        function show_email_item(){
            var mail_dirver = $("#mail_driver").val();
            if(mail_dirver == 'smtp'){
                $(".smtp-item").show();
                $(".sendmail").hide();
            }else{
                $(".smtp-item").hide();
                $(".sendmail").show();
            }
        }
        $(function(){
            show_email_item();
            $("#mail_driver").change(function(){
                show_email_item();
            });

            $("#btn_test_email").click(function(){
                if(confirm('请确认邮件配置项已保存成功？')){
                    $("#test_email_model").modal('show');
                }
            });

            /*发送测试邮件*/
            $("#submit_test_email").click(function(){
                var sendTo = $("#test_send_to").val();
                var content = $("#test_email_content").val();

                $.post('/admin/tools/sendTestEmail',{sendTo:sendTo,content:content},function(msg){
                    console.log(msg);
                    if(msg == 'ok'){
                        alert('邮件发送成功');
                    }else{
                        alert('邮件发送错误：'+ msg );
                    }
                    $("#test_email_model").modal('hide');
                });
            });

        });
    </script>
</div>